<!-- 名片二维码 -->
<template>
  <view class="container">
    <topBar :title="titleItem" />
    <view class="main_content">
      <view class="code_img">
        <image :src="imgUrl" mode=""></image>
      </view>
      <view class="statement">
        您可保存二维码放名片、海报、网站或公众号中AI智能追踪技术讲记录扫描访问您名片的访客，助您精准获客
      </view>
    </view>
    <Festival></Festival>
  </view>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import topBar from "../../components/topBar.vue";
import { ImagePreview } from "vant";

export default {
  //import引入的组件需要注入到对象中才能使用
  components: {
    topBar,
    ImagePreview,
  },
  data() {
    //这里存放数据
    return {
      titleItem: "名片二维码",
      imgUrl: "",
      show: false,
      id: ''
    };
  },
  onLoad(e){
    this.id = e.id
  },
  mounted() {
    this.generateCode();
  },
  //方法集合
  methods: {
    getUseinfo() {
      let token = uni.getStorage("token");
    },
    onChange(index) {
      this.index = index;
    },
    // 生成二维码
    generateCode() {
      this.$get("/bmj-api/api/ums/umsBusinessCard/generateQRCode?id=" + this.id).then(
        (res) => {
          // console.log(res);
          let { result, code } = res;
          if (code == 200) {
            this.imgUrl = result;
          }
        }
      );
    },
    // 点击保存图片
    saveImage() {
      if (this.imgUrl) {
        uni.showToast({
          title: "保存成功",
          duration: 2000,
          icon: "none",
        });
      } else {
        uni.showToast({
          title: "保存失败",
          duration: 2000,
          icon: "none",
        });
      }
    },
  }
};
</script>
<style lang="less" scoped>
//@import url(); 引入公共css类
.main_content {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;

  .code_img {
    width: 440rpx;
    height: 440rpx;
    margin: 120rpx 0;
    background-color: #fff;
    image {
      width: 100%;
      height: 100%;
    }
  }

  .statement {
    padding: 0 34px;
    font-size: 32rpx;
    color: #aaaaaa;
  }
  .btn {
    margin: 80rpx auto;
    width: 290rpx;
    height: 80rpx;
    background-color: #1678ff;

    text-align: center;
    line-height: 80rpx;
    border-radius: 10rpx;
    a {
      color: #fff;
      font-size: 32rpx;
    }
  }
}
</style>
